<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<style type="text/css">
html {
	font-family: sans-serif;
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
}

body {
	margin: 40px;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

td, th {
	padding: 0;
}

.pure-table {
	border-collapse: collapse;
	border-spacing: 0;
	empty-cells: show;
	border: 1px solid #cbcbcb;
}

.pure-table caption {
	color: #000;
	font: italic 85%/1 arial, sans-serif;
	padding: 1em 0;
	text-align: center;
}

.pure-table td, .pure-table th {
	border-left: 1px solid #cbcbcb;
	border-width: 0 0 0 1px;
	font-size: inherit;
	margin: 0;
	overflow: visible;
	padding: .5em 1em;
}

.pure-table thead {
	background-color: #e0e0e0;
	color: #000;
	text-align: left;
	vertical-align: bottom;
}

.pure-table td {
	background-color: transparent;
}

.pure-table-bordered td {
	border-bottom: 1px solid #cbcbcb;
}

.pure-table-bordered tbody>tr:last-child>td {
	border-bottom-width: 0;
}
</style>
</head>
<body>
	<form action="${pageContext.request.contextPath}/QueryOrder"
		method="post">
		订单编号：<input type="text" name="order_id" /> 用户：<input type="text"
			name="userName" /> 收货人：<input type="text" name="contactman" />
		订单状态:<select name="status">
			<option value="">请选择</option>
			<option value="0">未付款</option>
			<option value="1">已付款</option>
			<option value="2">已发货</option>
			<option value="3">已收货</option>
		</select> <input type="submit" value="查询" />
		<table class="pure-table pure-table-bordered" id="table">
			<thead>
				<tr>
					<th>订单编号</th>
					<th>用户</th>
					<th>收货人</th>
					<th>收货人地址</th>
					<th>收货人电话</th>
					<th>订单日期</th>
					<th>发货日期</th>
					<th>收货日期</th>
					<th>总金额</th>
					<th>备注</th>
					<th>状态</th>
					<th>查看详情</th>
					<th>操作</th>
				</tr>
			</thead>
			<tbody>
				<c:forEach var="order" items="${orderlist}">
					<tr>
						<td>${order.order_id }</td>
						<td>${order.userName }</td>
						<td>${order.contactman }</td>
						<td>${order.address }</td>
						<td>${order.phone }</td>
						<td>${order.orderDate }</td>
						<td>${order.deliverDate }</td>
						<td>${order.receiveDate }</td>
						<td><fmt:formatNumber type="number" value="${order.orderSum}"
								pattern="0.00" maxFractionDigits="2" /></td>
						<td>${order.note }</td>
						<td><c:choose>
								<c:when test="${order.status eq '0'}">
									未付款
    							</c:when>
								<c:when test="${order.status eq '1'}">
									已付款
    							</c:when>
								<c:when test="${order.status eq '2'}">	
									已发货
    							</c:when>
								<c:otherwise>
									已收货
    							</c:otherwise>
							</c:choose></td>
						<td><a
							href="${pageContext.request.contextPath}/QueryOrderDetial?order_id=${order.order_id}">查看详情</a>
						</td>
						<td><c:choose>
								<c:when test="${order.status eq '0'}">
									<a href="${pageContext.request.contextPath}/CancelOrder?order_id=${order.order_id} ">取消订单</a>
								</c:when>
								<c:when test="${order.status eq '1'}">
									<a href="${pageContext.request.contextPath}/CancelOrder?order_id=${order.order_id} ">发货</a>
								</c:when>
							</c:choose></td>
					</tr>
				</c:forEach>
			</tbody>
		</table>

	</form>
	<div class="page_turn" style="margin-top: 40px;">

		<form>
			<center>
				<span>共条</span> <span><a href="#" id="spanFirst">首页</a></span> <span><a
					href="#" id="spanPre">上一页</a></span> <span id="spanPageNum"></span>/<span
					id="spanTotalPage"></span>页 <span><a href="#" id="spanNext">下一页</a></span>
				<span><a href="#" id="spanLast">尾页</a></span> <span><a
					href="${pageContext.request.contextPath}/user/home_page.jsp"
					target="right">【返回主页】</a></span>
			</center>
		</form>

	</div>
</body>
<script type="text/javascript">
	var theTable = document.getElementById("table");
	var totalPage = document.getElementById("spanTotalPage");
	var pageNum = document.getElementById("spanPageNum");
	var spanPre = document.getElementById("spanPre");
	var spanNext = document.getElementById("spanNext");
	var spanFirst = document.getElementById("spanFirst");
	var spanLast = document.getElementById("spanLast");
	var numberRowsInTable = theTable.rows.length;
	var pageSize = 10;//每一页条数
	var page = 1;//
	//下一页
	function next() {
		hideTable();
		currentRow = pageSize * page;
		maxRow = currentRow + pageSize;
		if ( maxRow > numberRowsInTable ){
			maxRow = numberRowsInTable;
		}
		for ( var i = currentRow; i < maxRow; i++ ) {
			theTable.rows[i].style.display = '';
		}
		page++;
		if ( maxRow == numberRowsInTable ){
			nextText();
			lastText();
		}
		showPage();
		preLink();
		firstLink();
	}
	//上一页
	function pre() {
		hideTable();
		page--;
		currentRow = pageSize * page;
		maxRow = currentRow - pageSize;
		if ( currentRow > numberRowsInTable )
		currentRow = numberRowsInTable;
		for ( var i = maxRow; i < currentRow; i++ ) {
			theTable.rows[i].style.display = '';
		}
		if ( maxRow == 0) {
			preText();
			firstText();
		}
		showPage();
		nextLink();
		lastLink();
	}
	//第一页
	function first() {
		hideTable();
		page = 1;
		for ( var i = 0; i < pageSize; i++ ) {
			theTable.rows[i].style.display = '';
		}
		showPage();
		preText();
		nextLink();
		lastLink();
	}
	//最后一页
	function last() {
		hideTable();
		page = pageCount();
		currentRow = pageSize * (page - 1);
		for ( var i = currentRow; i < numberRowsInTable; i++ ) {
			theTable.rows[i].style.display = '';
		}
		showPage();
		preLink();
		nextText();
		firstLink();
	}
	function hideTable() {
		for ( var i = 0; i < numberRowsInTable; i++ ) {
			theTable.rows[i].style.display = 'none';
		}
	}
	function showPage() {
		pageNum.innerHTML = page;
	}
	//总共页数
	function pageCount() {
		var count = 0;
		if ( numberRowsInTable % pageSize != 0) count = 1; 
		return parseInt(numberRowsInTable/pageSize) + count;
	}
	//显示链接
	function preLink() { spanPre.innerHTML = "<a href='javascript:pre();'>上一页</a>"; }
	function preText() { spanPre.innerHTML = "上一页"; }
	function nextLink() { spanNext.innerHTML = "<a href='javascript:next();'>下一页</a>"; }
	function nextText() { spanNext.innerHTML = "下一页"; }
	function firstLink() { spanFirst.innerHTML = "<a href='javascript:first();'>首页</a>"; }
	function firstText() { spanFirst.innerHTML = "首页"; }
	function lastLink() { spanLast.innerHTML = "<a href='javascript:last();'>尾页</a>"; }
	function lastText() { spanLast.innerHTML = "尾页"; }
	//隐藏表格
	function hide() {
		for ( var i = pageSize; i<numberRowsInTable; i++ ) {
			theTable.rows[i].style.display = 'none';
		}
		totalPage.innerHTML = pageCount();
		pageNum.innerHTML = '';
		nextLink();
		lastLink();
	}
	hide();
	
	//单双行颜色区分
	function doubleBgColor(Table,Bg1,Bg2) {
	    for (var i=0;i<Table.rows.length;i++){
	    	Table.rows[i].bgColor=i%2?Bg2:Bg1;
	    }
	}
	
	function toCheck() {
		var checkAll = document.getElementById("firstCb");
		var checkboxs = document.getElementsByName("nid");
		var countnum = 0;
		for(var i = 0;i < checkboxs.length;i++){
			if(checkboxs[i].checked){
				countnum++;
			}
		}
		if(countnum == checkboxs.length){
			checkAll.checked = true;
		}else{
			checkAll.checked = false;
		}
	}
	
	window.onload = function() {
		showPage();
		doubleBgColor(document.getElementById("table"),"#DDDDDD","FFFFF");
	    document.getElementById("delSelected").onclick = function(){
	    	var r = confirm("您确定要删除选中信息吗？");
	        if(r==true){
	        	var srr = "";
	        	var inp = document.getElementsByName("nid");
	        	for(var i = 0;i < inp.length;i++){
	        		if(inp[i].checked == true) {	//input的样式是checkbox时就添加到空数组中;
	        			srr += inp[i].value + ",";
	        		}
	        	}
	        	location.href="${pageContext.request.contextPath}/Delete?allnid="+srr+"";
	        }
	    }

	    //获取checkbox
	    document.getElementById("firstCb").onclick = function(){
	        //获取下摆你列表中所有cd
	        var cbs = document.getElementsByName("nid");
	        //遍历
	        for (var i = 0; i < cbs.length; i++) {
	            //设置cbs[]的check状态 = firstCb.checked
	            cbs[i].checked = this.checked;
	        }
	    }
	};
</script>
</html>